<template>
<div class="bigscreen">
    
  <el-container>
  <el-aside width="200px"><tree ref="list" :treeList="cameraList"></tree></el-aside>
  <el-container>
    <!-- <el-header>Header</el-header> -->
    <el-main><screen></screen></el-main>
  </el-container>
</el-container>
    
</div>
</template>

<script>
import tree from '../Tree/index.vue'
import screen from '../splitScreen/index.vue'

import { listCamera} from "@/api/resource/equipment/camera/camera";

export default {
    name: 'MonitorScreen',
    components: {
        screen,
        tree
    },
    data() {
        return {
        // 摄像机表格数据
        cameraList: [],
        }

    },
    created() {
        
    },
    mounted(){
 
      listCamera(this.queryParams).then(response => {
        console.log("开始查询摄像机列表")
        this.cameraList = response.rows;
        console.log(this.cameraList)
      });
    },

}
</script>

<style>
.bigscreen {
  height: 800px;
}
  
  .el-aside {
    background-color: #D3DCE6;
    color: #333;
    text-align: center;
    line-height: 600px;
  }
  
  .el-main {
    background-color: #E9EEF3;
    color: #333;
    text-align: center;
    line-height: 160px;
  }
  
  .bigscreen > .el-container {
    margin-bottom: 40px;
    line-height: 600px;
    height: inherit;
  }

</style>